new Vue({
    el:'#app',
    data:{
        books:[
            {
                id: 1,
                name: '《红楼梦》',
                date: '2020-05-13',
                price: 119.88,
                num: 1
            },
            {
                id: 2,
                name: '《水浒传》',
                date: '2020-05-13',
                price: 139.66,
                num: 1
            },
            {
                id: 3,
                name: '《西游记》',
                date: '2020-05-13',
                price: 199.00,
                num: 1
            },
            {
                id: 4,
                name: '《三国演义》',
                date: '2020-05-13',
                price: 998.88,
                num: 1
            }
        ]
    },
    methods: {
        sub(index) {
            this.books[index].num--
        },
        add(index) {
            this.books[index].num++
        },
        remove(index) {
            this.books.splice(index,1)
        }
    },
    computed: {
        totalPrice() {
            let total = 0;
            for(let i = 0; i<this.books.length; i++) {
                total += this.books[i].price * this.books[i].num
            }
            return total
        }
    },
    filters: {
        showPrice(price) {
            return '￥' + price.toFixed(2)
        }
    }
})